<template>
    <view>
        <view class="item"
            v-for="i in news"
            :key="i.id">
            <view class="img">
                <img class="news-img" :src="i.src" alt="" />
            </view>
            <view class="info">
                <view class="name">{{ i.title }}</view>
                <view class="desc">
                    {{i.content}}
                </view>
                <navigator class="button" url="/pages/community/The-Community/communityDetails">加入</navigator>
            </view>
        </view>
    </view>
</template>
<style lang="scss" scoped>
.item {
    background-color: #ffffff;
    padding: 10rpx 0;
    display: flex;
    overflow: hidden;
    .img{
        flex: 1;
        padding: 10rpx;
        .news-img {
            flex: 1;
            width: 90px;
            height: 70px;
        }
    }
    .info{
        flex :2;
        padding: 0 10rpx;
        border-bottom: 1px #efefef solid;
        .name {
            font-size: 35rpx;
            color: #000;
            padding: 10rpx 0;
        }
        .desc {
            padding: 10rpx 0;
            width: 250px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            color: #979797;
            font-size: 24rpx;
            margin: 5px 0;
        }
        .button{
            padding: 1rpx;
            width: 70px;
            color: #51c4d3;
            height: 30px;
            font-size: 12px;
            border: 1rpx solid rgb(249, 250, 250);
        }    
    }
}
</style>
<script>
export default {
    data() {
        return {
        src:[
            "../../../static/台球社.jpeg ",
            "../../../static/棋牌室.jpeg"
        ],
        news: [
            {
            id: 0,
            title: "台球睦邻社",
            content:
                "是从现代人居特色与人性需求出发，结合绿城服务园区业主群特点，以项目会所或其他公共资源为载体，以娱乐生活为基本 功能，而开发创立的具有绿城服务特色的，以睦邻社、沙龙、社团为运营模式的业主睦邻交流，沟通互动平台",
            src:"../../../static/台球社.jpeg",
            button:"加入",
            type: 1,
            },
            {
            id: 1,
            title: "春江明月棋牌室",
            content:
                "是从现代人居特色与人性需求出发，结合绿城服务园区，以项目会所或其它公共资源为载体，以园区文化教育、娱乐生活为基本功能，而开发创立的具有绿城服务特色的、以睦邻社、沙龙、社团为运营模式的业主睦邻交流，沟通互动平台",
            src:"../../../static/棋牌室.jpeg",
            button:"加入",
            type: 2,
            },
        ],
        indicatorDots: true,
        autoplay: true,
        interval: 2000,
        duration: 500,
        };
    },
    methods: {
        toDetails() {
            uni.navigateTo({
            url: "./communityDetails"
            });
        }
    }
}
</script>